<template>
  <div class="sku_content">
    <section>
      <van-image width="25vw" height="25vw" :src="goodsInfo.list_pic_url" />
      <div class="sku_info">
        <div>价格：￥ {{ goodsInfo.retail_price | priceFilter }}</div>
        <div>库存：{{ goodsInfo.goods_number }}</div>
      </div>
      <!-- <van-icon name="cross" @click="closeSku" /> -->
    </section>
    <p>数量：</p>
    <van-stepper
      v-model="stepperVal"
      :min="1"
      :max="goodsInfo.goods_number"
      input-width="100px"
      button-size="32px"
      @change="stepChangeFn"
    />
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  created() {},
  mounted() {},
  methods: {},
};
</script>

<style scoped lang="less">
.sku_content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30vh;
    background: #fff;
    border-bottom: 1px solid #ccc;
    padding: 10px 2%;
    box-sizing: border-box;
    section {
      display: flex;
      justify-content: space-between;
      .sku_info {
        text-align: left;
        width: 60vw;
        line-height: 12.5vw;
      }
    }
  }
</style>
